<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link type="text/css" rel="stylesheet" href="css/index.css">
    <script src="js/vue.js"></script>
    <script src="js/index.js"></script>
    <script src="js/axios.min.js"></script>
    <script src="/js/axios-interceptor.js"></script>
</head>
<body>
<div id="app">

    <el-form :inline="true" :model="search" class="demo-form-inline">
        <el-form-item label="题目名称">
            <el-select v-model="search.examId" clearable  placeholder="题目名称">
                <el-option v-for="item in items"
                           :label="item.content" :value="item.id"></el-option>
            </el-select>
        </el-form-item>
        <el-form-item>
            <el-button type="primary" @click="onSubmit">查询</el-button>
        </el-form-item>
    </el-form>

    <template>
        <el-table
                :data="tableData"
                style="width: 100%">
            <el-table-column
                    prop="username"
                    label="姓名">
            </el-table-column>
            <el-table-column
                    prop="content"
                    label="题目内容">
            </el-table-column>
            <el-table-column
                    prop="isdown"
                    label="是否完成">
            </el-table-column>

            <el-table-column
                    fixed="right"
                    label="操作"
                    width="100">
                <template slot-scope="scope">
                    <el-button :disabled="scope.row.id==null" @click="review(scope.row)" type="text" size="small">预览</el-button>
                    <el-button :disabled="scope.row.id==null" @click="dload(scope.row)" type="text" size="small">下载</el-button>
                    <el-button :disabled="scope.row.id==null" @click="del(scope.row)" type="danger" size="small">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
    </template>
</div>


</body>
<script>
    new Vue({
        el:"#app",
        data:{
            tableData: [],
            items:[],
            search:{}
        },
        methods:{
            del(row){
                axios.delete("/user/delJob?id="+row.id).then((res)=>{
                    if(res.data.flag){
                        this.$message.success("删除成功！");
                        this.searchCon();
                    }else {
                        this.$message.error(res.data.data);
                    }
                });
            },
            review(row){
                window.location.href= "/user/review?id="+row.id;
            },
            dload(row){
                window.location.href = "/user/dload?id="+row.id;
            },
            onSubmit(){
                /*axios.post("/user/listExam?examId="+this.search.examId).then((res)=>{
                    this.tableData = res.data.data;
                });*/
                this.searchCon();
            },
            searchCon(){
                let eid = this.search.examId?this.search.examId:localStorage.getItem("examId");
                axios.post("/user/listExam?examId="+eid).then((res)=>{
                    this.tableData = res.data.data;
                });
            }
        },
        mounted(){
            axios.get("/user/exams").then((res)=>{
                this.items = res.data.data;
            });
            this.searchCon();

            /*axios.post("/user/listExam?examId="+localStorage.getItem("examId")).then((res)=>{
                this.tableData = res.data.data;
                console.log(this.tableData);
            });*/
        }
    });
</script>
</html>
